import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

export default new Vuex.Store({
    state: {
        todos: [
            { id: 1, name: "打华锟", done: false },
            { id: 2, name: "华锟吃屎", done: false },
        ],
        activeTab: 'all',
    },
    getters: {
        // checkAlls(state) {
        //     let checked = true;
        //     state.todos.map((item) => {
        //         if (item.done) {
        //             checked = false;
        //         }
        //     });
        //     return checked;
        // },
        checkAlls(state) {
            let checked = true;
            // 只要todo 里面有一个 status false => allChecked = false
            state.todos.map((item) => {
                if (!item.done) checked = false;
            });
            return checked;
        },
        unfinished(state) {
            let unfinisheds = state.todos.filter((item) => {
                return !item.done;
            });
            return unfinisheds.length;
        },
        activeTab: function(state) {
            return state.activeTab;
        },
        filterTodos: function(state) {
            // all active completed
            if (state.activeTab === "all") {
                return state.todos;
            } else if (state.activeTab === "active") {
                return state.todos.filter((item) => {
                    // v.status => false
                    return item.done;
                });
            } else if (state.activeTab === "completed") {
                return state.todos.filter((item) => {
                    // v.status => true
                    return !item.done;
                });
            }
        },
    },
    mutations: {
        changeActiveTab(state, { payload }) {
            state.activeTab = payload.activeTab;
        },

        //添加待办事项
        addTodos(state, { payload }) {
            state.todos.push(payload);
        },

        //清除所有事项
        clearAllClick(state) {
            state.todos = [];
        },

        //删除当前点击的事项
        deleteItem(state, { payload }) {
            state.todos.splice(payload.index, 1);
        },
        //清除所有完成的事项
        handleClearCompleted(state) {
            let newtodos = state.todos.filter((item) => {
                return !item.done;
            });
            state.todos = newtodos;
        },
        checkAll(state) {
            state.todos.map((item) => {
                item.done = true;
            })
        }
    },
    actions: {},
    modules: {},
});